<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../js/layui/css/layui.css"/>
    <script src="../js/layui/layui.js"></script>
    <script src="../js/jquery/jquery-1.9.1.js"></script>
</head>
<body>
<div id="add-main" style="display: none;">
    <form class="layui-form" id="add-form" action="">
        <div class="layui-form-item">
            <label class="layui-form-label">公司名称</label>
            <div class="layui-input-block">
                <input type="text" name="comname" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">行业类别</label>
            <div class="layui-input-block">
                <input type="text" name="hangyetype" lay-verify="required" lay-reqtext="用户名是必填项，岂能为空？" placeholder="请输入" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">项目名称</label>
                <div class="layui-input-inline">
                    <input type="tel" name="projectname"  autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">描述</label>
                <div class="layui-input-inline">
                    <input type="text" name="miaoshu"  autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md3">
            </div>
            <div class="layui-col-md4">
                <button class="layui-btn" lay-submit lay-filter="save" >立即提交</button>
            </div>
            <div class="layui-col-md4">
                <button type="reset" class="layui-btn layui-btn-primary" id="closeBtn" >重置</button>
            </div>
        </div>
    </form>
</div>
<a class="layui-btn layui-btn-warm layui-btn-radius layui-btn-xs" onclick="onAddBtn()">新增</a>
<table id="date" lay-filter="test" ></table>
<div id="toolbar" style="display: none;">
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</div>
</body>
<script>
    var table;
    layui.use(['table','layer','form','element'], function() {
        table = layui.table;
        var element = layui.element;
        var layer = layui.layer;
        var form = layui.form;
            table.render({
                elem: '#date',
                id:"table",
                fit: true,
                url: '../web/queryXiangMu', //数据接口
                type: "POST",
                cols: [
                    [ //表头
                        {type: 'checkbox', fixed: 'left'},
                        {field: 'id', title: '编号', sort: true, align: 'center', fixed: 'left'},
                        {field: 'comname', title: '公司名称', align: 'center'},
                        {field: 'hangyetype', title: '行业类别', align: 'center'},
                        {field: 'projectname', title: '项目名称', align: 'center'},
                        {field: 'miaoshu', title: '描述', align: 'center'},
                        {fixed: 'right',title: '操作', width: 250, align: 'center', toolbar: '#toolbar'}
                    ]
                ]
            });

        // 监听你的表格
        table.on('tool(test)', function(obj) {
            var data = obj.data;
            var id = data.id
            var name = data.name
            //  查看ID  ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓  方法
            if (obj.event === 'detail') {
                layer.msg('ID：' + data.id + ' 的查看操作');

                //删除  ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓  方法
            }
            if(obj.event==="del"){
                $.ajax({
                    url:"../web/delXiangMu",
                    type:"post",
                    data:{id:data.id},
                    success:function (data) {
                        if(!data){
                            layer.msg("删除失败", {icon: 5});
                        }else{
                            /* layer.msg(data.id);*/
                            layer.msg("删除成功", {icon: 6});
                            table.reload("table",{});
                        }
                    }
                })
            }
        })
    })
    var layer;
    layui.use(['layer', 'form'], function () {
         layer = layui.layer,
            $ = layui.jquery,
            form = layui.form;

        //提交监听事件
        form.on('submit(save)', function (data) {
            params = data.field;//表单里面所有的值
            //alert(JSON.stringify(params))//
            submit($,params);
            return false;
        })
    })

    function submit($,params){
        $.post('../web/addXiangmu', params, function (data) {//返回的数据
            if (data) {
                alert("成功")
                layer.close(layer.index);
                table.reload("table",{});
            }else{
                // parent.location.href='${ctx}/golbal/main';
                layer.alert("失败")
            }
        }, 'json');
    }

    function onAddBtn(){
        //页面层-自定义
        layer.open({
            type: 1,
            title:"新增",
            closeBtn: false,
            shift: 2,
            area: ['800px', '500px'],
            shadeClose: true,
            // btn: ['新增', '取消'],
            // btnAlign: 'c',
            content: $("#add-main"),
            success: function(layero, index){},
            yes:function(){
            }
        });
    }
</script>
</html>